<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Forever iFrame Example</title>
    <script src="/webIM/static/js/pushstream.js"></script>
    <script src="http://tongji.mhacn.com/static/common/js/jquery-2.1.4.min.js"></script>
</head>
<body>
    <p>Messages:</p>
    <div id="messages" style="width:800px;height:300px;overflow:scroll;"></div>
    <form id='send' action="/webIM/application/iframe/send.php">
        <input type="text" name="message" id='message'>
        <input type="text" name="username">
        <input type="submit" value="submit">
    </form>

    <script type="text/javascript">
        $('#send').on('submit', function (event) {
            event.preventDefault();
            var _this = $(this);
            $.post(_this.attr('action'), _this.serialize(), function (data) {
                var ret = $.parseJSON(data);

                if (1 == ret.stored_messages) {
                    $('#message').val('');
                } else {
                    alert('发送失败！');
                }
            });
        });

        function messageReceived(text, id, channel) {
            document.getElementById('messages').innerHTML += id + ': ' + text + '<br>';
        };

        var pushstream = new PushStream({
            host: 'push.virtual.net',
            port: 80,
            modes: "stream"
        });
        pushstream.onmessage = messageReceived;
        pushstream.addChannel('iframe1');
        pushstream.connect();
    </script>
</body>
</html>